<template>
  <div>
<!--    <div class="row-header">-->

<!--    </div>-->
<!--    <div class="split-line"></div>-->
    <div class="row-main">
      <el-button size="small" type="shenda" @click="toBack" icon="el-icon-back" style="margin-left: 20px">返回</el-button>
      <el-card style="width: 600px; height: 100%; margin: 0 auto;">
        <div slot="header" class="clearfix" style="text-align: center">
          <span>{{ title }}</span>
        </div>
        <el-form :model="interfaces" :rules="interfacesRules" ref="interfaces" label-width="200px" >
          <!--<el-form-item label="通道选择o" prop="channelCompanyId">
            <el-select size="small" v-model="interfaces.channelCompanyId" placeholder="通道选择" style="width: 90%;" @change="changeChannelCompany" ref="abc">
              <el-option v-for="company in dictOperatorNameSelect" :key="company.id" :label="company.name" :value="company.id"></el-option>
            </el-select>
          </el-form-item>-->
          <el-form-item label="通道选择" prop="channelCompanyId">
            <el-select size="small" v-model="interfacesSel" placeholder="通道选择" style="width: 90%;" @change="changeChannelCompany1" ref="abc">
              <el-option v-for="company in dictOperatorNameSelect" :key="company.value" :label="company.label" :value="company"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="config.accountName.label" prop="accountName">
            <el-input size="small" v-model="interfaces.accountName" style="width: 90%;" ></el-input>
          </el-form-item>
          <!--  卡体类型  -->
          <el-form-item label="卡体类型" prop="dicType">
            <el-select size="small" v-model="interfaces.dicType" placeholder="请选择卡体类型" style="width: 90%;" >
              <el-option label="卡体通道" value="CARD"></el-option>
              <el-option label="设备通道" value="DONGLE"></el-option>
            </el-select>
          </el-form-item>
          <!-- logo类型 -->
          <el-form-item label="LOGO类型" prop="dictDisplayLogoType"  v-if="interfaces.dicType=='DONGLE'">
            <el-select size="small" v-model="interfaces.dictDisplayLogoType" placeholder="请选择LOGO类型" style="width: 90%;" >
              <el-option label="跟随卡板运营商" value="FLOW_CARD_LOGO"></el-option>
              <el-option label="上传特殊logo" value="SPECIAL_LOGO"></el-option>
              <el-option label="强制不显示" value="DISPLAY_NONE_LOG"></el-option>
            </el-select>
          </el-form-item>
          <!-- 上传特殊logo -->
          <el-form-item label="上传特殊logo" prop=""  v-if="interfaces.dicType=='DONGLE'&&interfaces.dictDisplayLogoType=='SPECIAL_LOGO'" >
            <div style="height: 100px">
              <input type="file" @change="getLogo" class="uploadClass" id="logo1" />
              <div class="uploadDom" >
                <span v-show="!specialLogoFile">+</span>
                <img :src="specialLogoFile" style="max-width: 100%;max-height: 100%;width: 100%;height: 100%" v-show="specialLogoFile" id="logoImg"/>
              </div>
              <div style="color: #AC1C34;font-size: 14px;position: relative;">*图片建议尺寸：200*80，大小不超过200KB</div>
            </div>
          </el-form-item>
          <!-- 是否显示WiFi设置 -->
          <el-form-item label="是否显示WiFi设置" prop="wifiSetting" v-if="interfaces.dicType=='DONGLE'">
            <el-radio-group v-model="interfaces.wifiSetting">
              <el-radio-button label="true">是</el-radio-button>
              <el-radio-button label="false">否</el-radio-button>
            </el-radio-group>
          </el-form-item>
<!--          &lt;!&ndash; 是否显示修改wifi名字 &ndash;&gt;-->
<!--          <el-form-item label="是否显示修改wifi名字" prop="modifyWifiName" v-if="interfaces.dicType=='DONGLE'">-->
<!--            <el-radio-group v-model="interfaces.modifyWifiName">-->
<!--              <el-radio-button label="true">是</el-radio-button>-->
<!--              <el-radio-button label="false">否</el-radio-button>-->
<!--            </el-radio-group>-->
<!--          </el-form-item>-->
<!--          &lt;!&ndash; 是否显示修改wifi密码 &ndash;&gt;-->
<!--          <el-form-item label="是否显示修改wifi密码" prop="modifyWifiPassword" v-if="interfaces.dicType=='DONGLE'">-->
<!--            <el-radio-group v-model="interfaces.modifyWifiPassword">-->
<!--              <el-radio-button label="true">是</el-radio-button>-->
<!--              <el-radio-button label="false">否</el-radio-button>-->
<!--            </el-radio-group>-->
<!--          </el-form-item>-->
<!--          &lt;!&ndash; 是否显示隐藏热点功能 &ndash;&gt;-->
<!--          <el-form-item label="是否显示隐藏热点功能" prop="ifDisplayWifiName" v-if="interfaces.dicType=='DONGLE'">-->
<!--            <el-radio-group v-model="interfaces.ifDisplayWifiName">-->
<!--              <el-radio-button label="true">是</el-radio-button>-->
<!--              <el-radio-button label="false">否</el-radio-button>-->
<!--            </el-radio-group>-->
<!--          </el-form-item>-->
          <!-- 是否显示切换运营商-移动 -->
          <el-form-item label="是否显示切换运营商-移动" prop="changeChinaMobile" v-if="interfaces.dicType=='DONGLE'">
            <el-radio-group v-model="interfaces.changeChinaMobile">
              <el-radio-button label="true">是</el-radio-button>
              <el-radio-button label="false">否</el-radio-button>
            </el-radio-group>
          </el-form-item>
          <!-- 是否显示切换运营商-联通 -->
          <el-form-item label="是否显示切换运营商-联通" prop="changeUnicom" v-if="interfaces.dicType=='DONGLE'">
            <el-radio-group v-model="interfaces.changeUnicom">
              <el-radio-button label="true">是</el-radio-button>
              <el-radio-button label="false">否</el-radio-button>
            </el-radio-group>
          </el-form-item>
          <!-- 是否显示切换运营商-联通 -->
          <el-form-item label="是否显示切换运营商-电信" prop="changeTelcom" v-if="interfaces.dicType=='DONGLE'">
            <el-radio-group v-model="interfaces.changeTelcom">
              <el-radio-button label="true">是</el-radio-button>
              <el-radio-button label="false">否</el-radio-button>
            </el-radio-group>
          </el-form-item>

          <!-- 是否显示隐藏热点功能 -->
          <el-form-item label="是否显示当前运营商" prop="ifDisplayOperators" v-if="interfaces.dicType=='DONGLE'">
            <el-radio-group v-model="interfaces.ifDisplayOperators">
              <el-radio-button label="true">是</el-radio-button>
              <el-radio-button label="false">否</el-radio-button>
            </el-radio-group>
          </el-form-item>
          <!--API账号 -->
          <el-form-item :label="config.userName.label" prop="userName" v-if="config.userName.display">
            <el-input size="small" v-model="interfaces.userName" style="width: 90%;" ></el-input>
          </el-form-item>
          <!--API账号密码-->
          <el-form-item :label="config.passwd.label" prop="passwd" v-if="config.passwd.display">
            <el-input size="small" v-model="interfaces.passwd" style="width: 90%;"></el-input>
          </el-form-item>
          <!--平台账号-->
          <el-form-item :label="config.soapUser.label" prop="soapUser" v-if="config.soapUser.display">
            <el-input size="small" v-model="interfaces.soapUser" style="width: 90%;" ></el-input>
          </el-form-item>
          <!--平台账号密码 apiKey-->
          <el-form-item :label="config.soapPasswd.label " prop="soapPasswd" v-if="config.soapPasswd.display">
            <el-input size="small" v-model="interfaces.soapPasswd" style="width: 90%;"></el-input>
          </el-form-item>
          <!--接口base路径-->
          <el-form-item :label="config.accountBaseUrl.label" prop="accountBaseUrl"  v-if="config.accountBaseUrl.display">
            <el-input size="small" v-model="interfaces.accountBaseUrl" style="width: 90%;"></el-input>
          </el-form-item>
          <el-form-item :label="config.apnId.label" prop="apnId"  v-if="config.apnId.display">
            <el-input size="small" v-model="interfaces.apnId" style="width: 90%;"></el-input>
          </el-form-item>
          <el-form-item :label="config.key.label" prop="key"  v-if="config.key.display">
            <el-input size="small" v-model="interfaces.key" style="width: 90%;"></el-input>
          </el-form-item>

          <el-form-item :label="config.fieldOne.label" prop="fieldOne"  v-if="config.fieldOne.display">
            <el-input size="small" v-model="interfaces.fieldOne" style="width: 90%;"></el-input>
          </el-form-item>
          <el-form-item :label="config.fieldTwo.label" prop="fieldTwo"  v-if="config.fieldTwo.display">
            <el-input size="small" v-model="interfaces.fieldTwo" style="width: 90%;"></el-input>
          </el-form-item>
          <el-form-item :label="config.fieldThree.label" prop="fieldThree"  v-if="config.fieldThree.display">
            <el-input size="small" v-model="interfaces.fieldThree" style="width: 90%;"></el-input>
          </el-form-item>
          <el-form-item :label="config.fieldFour.label" prop="fieldFour"  v-if="config.fieldFour.display">
            <el-input size="small" v-model="interfaces.fieldFour" style="width: 90%;"></el-input>
          </el-form-item>

        </el-form>
        <div style="width: 100%;height: 40px;text-align: center">
          <el-button size="small" type="primary" @click="submitHandle('interfaces')" v-preventReClick>确定</el-button>
          <el-button size="small" @click="toBack">取消</el-button>
<!--          <el-button size="small" type="warning" @click="accountTest">测试通道</el-button>-->
        </div>
      </el-card>
<!--      <el-dialog-->
<!--        title="通道参数测试"-->
<!--        :visible.sync="showTestDialog"-->
<!--        :width="$store.state.app.screenWidth<992?'100%':'500px'"-->
<!--        center>-->
<!--        <el-form :model="form" label-position="left">-->
<!--          <el-form-item prop="cardNo" label="ICCID">-->
<!--            <el-input v-model="form.iccid" placeholder="请输入待测试的iccid"/>-->
<!--          </el-form-item>-->
<!--        </el-form>-->
<!--        <span slot="footer" class="dialog-footer">-->
<!--          <el-button @click="showTestDialog = false">取 消</el-button>-->
<!--          <el-button type="primary" @click="doTestAccount">确 定</el-button>-->
<!--        </span>-->
<!--      </el-dialog>-->

    </div>
  </div>
</template>

<script>
import { interfaceAccountConfigurationSelect,interfaceAccountConfigurationEdit, interfaceAccountConfigurationSave,interfaceAccountConfigurationTest } from '@/api/getData'

export default {
  name: 'AddAccount',
  data() {
    return {
      interfacesRules: {
        accountName: [{ required: true, message: '请选择通道', trigger: 'change' }],
        channelCompanyId: [{ required: true, message: '请输入此信息', trigger: 'change' }],
        userName: [{ required: true, message: '请输入此信息', trigger: 'blur' }],
        passwd: [{ required: true, message: '请输入此信息', trigger: 'blur' }],
        soapUser: [{ required: true, message: '请输入此信息', trigger: 'blur' }],
        soapPasswd: [{ required: true, message: '请输入此信息', trigger: 'blur' }],
        accountBaseUrl:[{ required: true, message: '请输入此信息', trigger: 'blur' }],
        fieldOne:[{ required: true, message: '请输入此信息', trigger: 'blur' }],
        fieldTwo:[{ required: true, message: '请输入此信息', trigger: 'blur' }],
        fieldThree:[{ required: true, message: '请输入此信息', trigger: 'blur' }],
        fieldFour:[{ required: true, message: '请输入此信息', trigger: 'blur' }],
        apnId:[{ required: true, message: '请输入此信息', trigger: 'blur' }],
        dicType:[{ required: true, message: '请选择卡体类型', trigger: 'blur' }],
        dictDisplayLogoType:[{ required: true, message: '请选择LOGO类型', trigger: 'blur' }],
      },
      interfacesSel:{
        id: '',
        name: '',
        dictOperator: '',
      },
      interfaces: {
        accountBaseUrl:'',
        accountName:'',
        channelCompanyId:"",
        key:'',
        dictOperatorName: '',
        dictOperator: '',
        apnId:'',
        fieldOne:'',
        fieldTwo:'',
        fieldThree:'',
        fieldFour:'',
        dictReadStatus:'',
        dicType: '',
        dictDisplayLogoType: '',
        modifyWifiName: true,
        modifyWifiPassword: true,
        changeChinaMobile:true,
        changeUnicom:true,
        changeTelcom:true,
        ifDisplayWifiName:true,
        ifDisplayOperators:true,
        wifiSetting:true,
      },
      dictOperatorNameSelect: [],
      id:'',
      config:{
        accountName:{
          label:"通道名字"
        },
        userName:{
          label:"API账号",
          display:false
        },
        passwd:{
          label:"API账号密码",
          display:false
        },
        soapUser:{
          label:"平台账号",
          display:false
        },
        soapPasswd:{
          label:"平台账号密码",
          display:false
        },
        apnId:{
          label:"apnId",
          display:false,

        },
        key:{
          label:"key",
          display:false
        },
        accountBaseUrl:{
          label:"accountBaseUrl",
          display:false
        },
        fieldOne:{
          label:"fieldOne",
          display:false
        },
        fieldTwo:{
          label:"fieldTwo",
          display:false
        },
        fieldThree:{
          label:"fieldThree",
          display:false
        },
        fieldFour:{
          label:"fieldFour",
          display:false
        }
      },
      value: false,
      paegkey: '',
      title: '',
      account: {},
      showTestDialog: false,
      form:{
        iccid: '',
      },
      logo: '',
      specialLogoFile: '',
    }
  },
  async mounted() {
    this.id = this.$route.query.id;
    this.title=this.id?'修改账号信息':'添加账号';
    this.initData();
    this.pagekey = await this.$getPageKey();
  },
  methods: {
    getLogo(){
      let _this = this;
      let size = document.getElementById('logo1').files[0].size;
      if(size>200*1024){
        this.$message.error('图片过大，请调整后继续上传');
        return false;
      }
      this.logo = document.getElementById('logo1').files[0];
      var reader = new FileReader();
      reader.readAsDataURL(this.logo); //base64
      //接收到图片时触发onload
      reader.onload = function(e){
        _this.specialLogoFile = reader.result;
        document.getElementById('logoImg').src = reader.result;
      };

    },
    //测试通道  已挪到list 行尾按钮
    // accountTest(){
    //   this.$refs.interfaces.validate(valid=>{
    //     if(valid){
    //       this.showTestDialog = true;
    //       this.form.iccid = '';
    //     }
    //     else{
    //       this.$message.error('请按照错误信息修改表单内容')
    //     }
    //   })
    //
    // },
    async doTestAccount(){
      if(!this.form.iccid){
        this.$message.error('请输入待测试的iccid');
        return false;
      }
      let res = await interfaceAccountConfigurationTest({
        id:this.id,
        channelCompanyId: this.interfaces.channelCompanyId,
        accountName:this.interfaces.accountName,
        userName: this.interfaces.userName,
        passwd: this.interfaces.passwd,
        apnId:this.interfaces.apnId,
        soapUser: this.interfaces.soapUser,
        soapPasswd: this.interfaces.soapPasswd,
        dictOperatorName: this.interfaces.dictOperatorName,
        dictOperator: this.interfaces.dictOperator,
        fieldOne: this.interfaces.fieldOne,
        fieldTwo: this.interfaces.fieldTwo,
        fieldThree: this.interfaces.fieldThree,
        fieldFour: this.interfaces.fieldFour,
        accountBaseUrl: this.interfaces.accountBaseUrl,
        dictReadStatus:this.interfaces.dictReadStatus==''?'C_ENABLE':this.interfaces.dictReadStatus,
        key:this.interfaces.key,
        iccid: this.form.iccid,
      })
      if(res._result){
        if(res.data.code=='success'){
          this.$message({
            type: 'success',
            message: '通道测试通过'
          })
          this.showTestDialog = false;
        }
        else{
          this.$message.error(res.data.msg)
        }
      }
    },
    toBack() {
      this.$router.back(-1)
    },
    async initData() {
      const returnData = await interfaceAccountConfigurationSelect({});
      this.dictOperatorNameSelect = []
      if (returnData._result) {
        returnData.data.forEach(item => this.dictOperatorNameSelect.push({ value: item.id, label: item.operatorBranch, dictOperator: item.dictOperator }))
      }
      if(this.id!=''&&this.id!=undefined&&this.id!=null){
        const pageData = await interfaceAccountConfigurationEdit({
          id: this.id
        })
        this.interfacesSel = {
          value: pageData.data.channelCompany.id,
          label: pageData.data.channelCompany.operatorBranch,
          dictOperator: pageData.data.channelCompany.dictOperator,
        }
        this.interfaces = pageData.data.account
        this.specialLogoFile = pageData.data.account.picture
        this.dicType = pageData.data.account.dicType
        this.changeChannelCompany1(this.interfacesSel)
      }
    },
    changeChannelCompany1(val){
      let _this = this;
      this.interfacesSel = val;
      this.interfaces.channelCompanyId = val.value;
      this.interfaces.dictOperator = val.dictOperator;
      this.interfaces.dictOperatorName = val.dictOperatorName;
      let arr = [
        { dictOperator: 'CHINAMOBILE', userName: '账号',passwd: '密码', apnId: 'apnId' },
        { dictOperator: 'UNICOM', userName: '账号',passwd: '密码', soapUser: 'openId', accountBaseUrl: 'appId', apnId:'appSecret', soapPasswd: 'apiKey',  key: '填写JASPER或者CMP' },//联通
        { dictOperator: 'TELECOM', userName: 'API账号',passwd: 'API账号密码', soapUser: '平台账号', soapPasswd: '平台账号密码', key: '企业ID' },//电信
        { dictOperator: 'ZHONGTIAN', userName: '账号',passwd: '密码', },//中天
        { dictOperator: 'SHENDA', userName: '账号',passwd: '密码', },//申达
        { dictOperator: 'XIAOXIANG', userName: '账号',passwd: '密码', },//小象
        { dictOperator: 'SHUOLANG', soapUser: 'userId', soapPasswd: 'apiKey', accountBaseUrl: '请求路径（后面加上/api/v1）' },//硕朗
        { dictOperator: 'MEILI', soapUser: '公钥', userName: '私钥', },//魅力
        { dictOperator: 'LONGWANG', userName: '账号', passwd: '密码', accountBaseUrl:'上游接口域名', key: "是否为联结算日(YES为是，不填或者其他为否)"},//龙网
        { dictOperator: 'CMPTELECOM', userName: '账号', passwd: '密码', key: "9位key"},//电信(CMP)
		{ dictOperator: 'TELECOM5G', userName: '账号', passwd: '密码', key: "9位key"},//电信(CMP)5G
        { dictOperator: 'SHENZHOU', userName: '用户名', key: "key"},//神州
        { dictOperator: 'BOSHI', userName: 'id', key: "secret", accountBaseUrl: '带http(s)的请求地址'},//博士
        { dictOperator: 'WANHUI', userName: '用户名', key: "密码", accountBaseUrl: '带http(s)的请求地址'},//万惠
        { dictOperator: 'FENGXUN', userName: '用户名', key: "key", },//蜂讯
        { dictOperator: 'ZHANGZHONG', userName: 'uid',passwd: 'apisec', accountBaseUrl: '接口URL'},//掌众
        { dictOperator: 'MIAOYOU', userName: 'apikey',passwd: 'secret', soapPasswd: 'soapPasswd', accountBaseUrl: '接口URL'},//喵友
        { dictOperator: 'TIANYI', userName: '用户ID',passwd: 'api_key', accountBaseUrl: '接口URL'},//天移
        { dictOperator: 'FENGYUN', userName: 'apikey', passwd: 'secret', accountBaseUrl: '接口URL',},//风云
        { dictOperator: 'HEYOUWULIAN', userName: 'user', passwd: 'password', accountBaseUrl: '接口URL',},//和优
        { dictOperator: 'WANGZHENWULIAN', userName: 'dealer', passwd: 'password', key: 'secret_key', accountBaseUrl: '接口URL',},//网真
        { dictOperator: 'GUANGYAO', userName: 'userName', passwd: 'password', accountBaseUrl: '接口URL',},//光耀
        { dictOperator: 'DONGFANGWULIAN', userName: 'appId', passwd: 'apiKey', accountBaseUrl: '接口URL',},//东方
        { dictOperator: 'XIAOXIANGXITONG', userName: 'account', passwd: 'pwd', key: '公钥', accountBaseUrl: '接口URL',},//小象
        { dictOperator: 'MENGYUN', userName: 'merchantid', passwd: 'apikey', accountBaseUrl: '接口URL',},//梦韵
        { dictOperator: 'YULEMAO', userName: '用户名', passwd: '密码', accountBaseUrl: '接口URL', },//梦韵
        { dictOperator: 'LIANTONGWULIAN', userName: '用户名', passwd: '密码', key: 'accessKey', accountBaseUrl: '接口URL', },//联通物联
        { dictOperator: 'FLOWPOOL', userName: '用户名', passwd: '密码', accountBaseUrl: '接口URL', },//FLOWPOOL
        { dictOperator: 'XIAOMING', userName: 'APPID', passwd: 'APPKEY', accountBaseUrl: '接口URL', },//小茗
        { dictOperator: 'ZIFENGYUNKA', userName: 'accountid', passwd: 'password', accountBaseUrl: '接口URL', },//紫峰云卡
        { dictOperator: 'TIANLIAN', userName: 'key', passwd: 'apiSecret', accountBaseUrl: '接口URL', },//天链
        { dictOperator: 'LEHUI', passwd: 'apiKey', accountBaseUrl: '接口URL', },//乐惠
        { dictOperator: 'GELIWULIAN', userName: 'userName', passwd: 'key', accountBaseUrl: '接口URL', },//格力物联
        { dictOperator: 'YOUXIANGZHILIAN', userName: 'appkey', passwd: 'secret', accountBaseUrl: '接口URL', },//优享智联
        { dictOperator: 'BOTONG', userName: 'accountName', passwd: 'appSecret',key:'appKey', accountBaseUrl: '接口地址(URL)', },//博通物联
        { dictOperator: 'YAMUCHA-LIANTONG', userName: 'username', key:'key', },//雅木茶-联通
        { dictOperator: 'YINGMENGYUN', userName: '用户id', passwd:'用户秘钥',accountBaseUrl: '接口URL' },//迎梦云科技
        //{ dictOperator: 'TIANYU', userName: 'traderId',key:'privateKey', accountBaseUrl: '接口地址(URL)', },//天俞物联搁置
        { dictOperator: 'HEYUNXIANG', userName: '用户名', key:'密码',accountBaseUrl: '接口URL' },
        { dictOperator: 'HEYUNXIANG_LUNXUN', userName: '用户名', key:'密码',accountBaseUrl: '接口URL' },
        { dictOperator: 'LIANTONGJIYUEHUA', accountBaseUrl:'接口URL',apnId: 'apnId', key:'key',soapUser: 'encodeKey',fieldOne: 'ivKey',userName: 'userName', fieldTwo: 'password',fieldThree: 'tenantId'  },
        { dictOperator: '179TONGDAO', userName: '手机号', passwd: 'token', accountBaseUrl: '接口URL', },//格力物联
        { dictOperator: 'ZHONGKONG', userName: '账号ID', passwd: '密码', accountBaseUrl: '接口URL', },//中控
		{ dictOperator: 'XINKEWEI', userName: '用户名', passwd: '密码', accountBaseUrl: '接口URL',key:'appKey',soapUser: '客户编码',soapPasswd: '供应商编码',},//xinkewei
        { dictOperator: 'GUANGDIAN', userName: 'APPID', passwd: '密钥', key:'集团编码', accountBaseUrl: '接口地址',soapUser: 'token地址', },//广电
        ]
      for(let item of arr){
        if(item.dictOperator==val.dictOperator){
          a(item)
          return
        }
      }
      function a(obj){
        _this.config.accountBaseUrl = { label:"", display:false };
        _this.config.userName = { label:"", display:false };
        _this.config.passwd = { label:"", display:false };
        _this.config.soapUser = { label:"", display:false };
        _this.config.soapPasswd = { label:"", display:false };
        _this.config.apnId = { label:"", display:false };
        _this.config.fieldOne = { label:"", display:false };
        _this.config.fieldTwo = { label:"", display:false };
        _this.config.fieldThree = { label:"", display:false };
        _this.config.fieldFour = { label:"", display:false };
        for(let n in obj){
          if(n!='dictOperator'){
            console.log(n)
            _this.config[n].display = true;
            _this.config[n].label = obj[n];
          }

        }
      }

    },
    /*changeChannelCompany() {
      let _this = this
      this.dictOperatorNameSelect.forEach(item => {
        //将配置全部都是false
        if (item.id === this.interfaces.channelCompanyId) {
          for (let configKey in this.config) {
            this.config[configKey].display=false
          }
          this.interfaces.dictOperator = item.dictOperator
          this.interfaces.dictOperatorName = item.dictOperatorName
          let operator = this.interfaces.dictOperator

          if(operator==='CHINAMOBILE'){
            this.config.userName.label="账号"
            this.config.passwd.label="密码"
            this.config.apnId.label="apnId"

            this.config.userName.display = true
            this.config.passwd.display = true
            this.config.apnId.display = true

            return
          }
          if(operator==='UNICOM'){//联通
            this.config.userName.label="账号"
            this.config.passwd.label="密码"
            this.config.soapPasswd.label="apiKey"
            this.config.soapUser.label="OPEN ID"
            this.config.accountBaseUrl.label="APP ID"
            this.config.apnId.label="APP SECRET"
            this.config.key.label="填写JASPER或者CMP"

            this.config.userName.display = true
            this.config.passwd.display = true
            this.config.soapPasswd.display = true
            this.config.accountBaseUrl.display = true
            this.config.soapUser.display = true
            this.config.apnId.display = true
            this.config.key.display = true
            return
          }
          if(operator==='TELECOM'){//电信
            this.config.userName.label="API账号";
            this.config.passwd.label="API账号密码";
            this.config.soapUser.label = "平台账号";
            this.config.soapPasswd.label =  "平台账号密码";
            this.config.key.label =  "企业ID";

            this.config.userName.display = true;
            this.config.passwd.display = true;
            this.config.soapUser.display = true;
            this.config.soapPasswd.display = true;
            this.config.key.display = true;

            return
          }
          if(operator=='ZHONGTIAN'||operator=='SHENDA'||operator=='XIAOXIANG'){//中天 || 申达 || 小象
            this.config.userName.label="账号";
            this.config.passwd.label="密码";
            this.config.userName.display = true;
            this.config.passwd.display = true;
            return
          }
          if(operator=='SHUOLANG'){ //硕朗
            this.config.soapUser.label="userId"
            this.config.soapPasswd.label="apiKey"
            this.config.accountBaseUrl.label="请求路径（后面加上/api/v1）"

            this.config.soapUser.display = true
            this.config.soapPasswd.display = true
            this.config.accountBaseUrl.display = true
            return
          }
		  if(operator=='XINKEWEI'){ //xinkewei
            this.config.userName.label="userName"
            this.config.passwd.label="密码"
            this.config.accountBaseUrl.label="请求路径"
			this.config.key.label = "接口密钥"
			this.config.soapUser.label = "接口密钥"
			this.config.soapPasswd.label = "供应商编码"
			
            this.config.soapUser.display = true
            this.config.soapPasswd.display = true
            this.config.accountBaseUrl.display = true
			this.config.key.display = true
			this.config.soapUser.display = true
			this.config.soapPasswd.display = true
            return
          }
          if(operator=='MEILI'){  //魅力
            this.config.soapUser.label="公钥"
            this.config.userName.label="私钥"
            this.config.soapUser.display = true
            this.config.userName.display = true
            return
          }
          if(operator=='LONGWANG'){ //龙网
            this.config.userName.label="账号";
            this.config.passwd.label="密码";
            this.config.accountBaseUrl.label="上游接口域名"
            this.config.key.label =  "是否为联结算日(YES为是，不填或者其他为否)"

            this.config.userName.display = true;
            this.config.passwd.display = true;
            this.config.accountBaseUrl.display = true
            this.config.key.display = true;

            return
          }
          if(operator=='CMPTELECOM'){ //电信(CMP)
            this.config.userName.label="账号";
            this.config.passwd.label="密码";
            this.config.key.label="9位key"

            this.config.userName.display = true;
            this.config.passwd.display = true;
            this.config.key.display = true

            return
          }
          if(operator=='TELECOM5G'){ //电信(CMP)5G
            this.config.userName.label="账号";
            this.config.passwd.label="密码";
            this.config.key.label="9位key"

            this.config.userName.display = true;
            this.config.passwd.display = true;
            this.config.key.display = true

            return
          }		  
          if(operator=='SHENZHOU'){ //神州
            this.config.userName.label="用户名";
            this.config.key.label="key"

            this.config.userName.display = true;
            this.config.key.display = true

            return
          }
          if(operator=='BOSHI'){  //博士

            this.config.userName.label="id";
            this.config.key.label="secret"
            this.config.accountBaseUrl.label="带http(s)的请求地址"

            this.config.userName.display = true;
            this.config.key.display = true
            this.config.accountBaseUrl.display = true
            return
          }
          if(operator=='WANHUI'){ //万惠

            this.config.userName.label="用户名";
            this.config.key.label="密码"
            this.config.accountBaseUrl.label="带http(s)的请求地址"

            this.config.userName.display = true;
            this.config.key.display = true
            this.config.accountBaseUrl.display = true
            return
          }
          if(operator=='FENGXUN'){ //蜂讯

            this.config.userName.label="用户名";
            this.config.key.label="key";
            this.config.userName.display = true;
            this.config.key.display = true;
            return
          }
          if(operator=='ZHANGZHONG'){ //掌众
            this.config.userName.label="uid";
            this.config.passwd.label="apisec";
            this.config.accountBaseUrl.label="accountBaseUrl";
            this.config.userName.display = true;
            this.config.passwd.display = true;
            this.config.accountBaseUrl.display = true;
            return
          }
          if(operator=='MIAOYOU'){ //喵友
            this.config.userName.label="apikey";
            this.config.passwd.label="secret";
            this.config.soapPasswd.label="soapPasswd";
            this.config.accountBaseUrl.label="accountBaseUrl";
            this.config.userName.display = true;
            this.config.passwd.display = true;
            this.config.accountBaseUrl.display = true;
            this.config.soapPasswd.display = true;
            return
          }
          if(operator=='TIANYI'){ //天移
            this.config.userName.label="user_id";
            this.config.passwd.label="api_key";
            this.config.accountBaseUrl.label="accountBaseUrl";
            this.config.userName.display = true;
            this.config.passwd.display = true;
            this.config.accountBaseUrl.display = true;
            return
          }
          if(operator=='FENGYUN'){ //风云
            // this.config.userName.label="apikey";
            // this.config.passwd.label="secret";
            // this.config.accountBaseUrl.label="accountBaseUrl";
            // this.config.userName.display = true;
            // this.config.passwd.display = true;
            // this.config.accountBaseUrl.display = true;
            return
          }
          if(operator=='HEYOUWULIAN'){ //和优
            // this.config.userName.label="user";
            // this.config.passwd.label="password";
            // this.config.accountBaseUrl.label="accountBaseUrl";
            // this.config.userName.display = true;
            // this.config.passwd.display = true;
            // this.config.accountBaseUrl.display = true;
            return
          }
          if(operator=='WANGZHENWULIAN'){ //网真
            // this.config.userName.label="dealer";
            // this.config.passwd.label="password";
            // this.config.key.label="secret_key";
            // this.config.accountBaseUrl.label="accountBaseUrl";
            // this.config.userName.display = true;
            // this.config.passwd.display = true;
            // this.config.accountBaseUrl.display = true;
            // this.config.key.display = true;
            return
          }
          if(operator=='GUANGYAO'){ //光耀
            // this.config.userName.label="userName";
            // this.config.passwd.label="password";
            // this.config.accountBaseUrl.label="accountBaseUrl";
            // this.config.userName.display = true;
            // this.config.passwd.display = true;
            // this.config.accountBaseUrl.display = true;

            return
          }
          if(operator=='DONGFANGWULIAN'){ //东方
            // this.config.userName.label="appId";
            // this.config.passwd.label="apiKey";
            // this.config.accountBaseUrl.label="accountBaseUrl";
            // this.config.userName.display = true;
            // this.config.passwd.display = true;
            // this.config.accountBaseUrl.display = true;
            let obj = {
              userName: 'appId',
              passwd: 'apiKey',
              accountBaseUrl: 'accountBaseUrl',
            }
            a(obj)
            return
          }
          if(operator=='XIAOXIANGXITONG'){ //小象
            // this.config.userName.label="account";
            // this.config.passwd.label="pwd";
            // this.config.accountBaseUrl.label="accountBaseUrl";
            // this.config.key.label="公钥";
            // this.config.userName.display = true;
            // this.config.passwd.display = true;
            // this.config.accountBaseUrl.display = true;
            // this.config.key.display = true;

            return
          }

        }
      })
    },*/
    submitHandle(interfaces) {
      this.$refs[interfaces].validate(async valid => {
        if (valid) {
          if(!this.id && !this.logo && this.interfaces.dictDisplayLogoType=='SPECIAL_LOGO'){
            this.$message.error('请上传上传特殊logo')
            return false
          }
          if(!this.id && this.logo && this.interfaces.dictDisplayLogoType=='SPECIAL_LOGO' && this.logo.size>200*1024){
            this.$message.error('您上传的特殊logo文件大小超过200K，请重新上传')
            return false
          }
          let accountConfig = {};
          if(this.interfaces.dicType == 'DONGLE'){
            accountConfig = {
              // modifyWifiName: this.interfaces.modifyWifiName,
              // modifyWifiPassword:this.interfaces.modifyWifiPassword,
              changeChinaMobile:this.interfaces.changeChinaMobile,
              changeUnicom:this.interfaces.changeUnicom,
              changeTelcom:this.interfaces.changeTelcom,
              // ifDisplayWifiName:this.interfaces.ifDisplayWifiName,
              ifDisplayOperators:this.interfaces.ifDisplayOperators,
              wifiSetting:this.interfaces.wifiSetting
            }
          }
          let form = {
            id:this.id,
            channelCompanyId: this.interfaces.channelCompanyId,
            accountName:this.interfaces.accountName,
            userName: this.interfaces.userName,
            passwd: this.interfaces.passwd,
            apnId:this.interfaces.apnId,
            soapUser: this.interfaces.soapUser,
            soapPasswd: this.interfaces.soapPasswd,
            dictOperatorName: this.interfaces.dictOperatorName,
            dictOperator: this.interfaces.dictOperator,
            accountBaseUrl: this.interfaces.accountBaseUrl,
            fieldOne: this.interfaces.fieldOne,
            fieldTwo: this.interfaces.fieldTwo,
            fieldThree: this.interfaces.fieldThree,
            fieldFour: this.interfaces.fieldFour,
            dictReadStatus:this.interfaces.dictReadStatus==''?'C_ENABLE':this.interfaces.dictReadStatus,
            key:this.interfaces.key,
            dictDisplayLogoType: this.interfaces.dictDisplayLogoType,// 显示logo类型
            accountConfig:  JSON.stringify(accountConfig),// 通道配置
            dicType: this.interfaces.dicType,
          }
          if(this.logo && this.interfaces.dictDisplayLogoType=='SPECIAL_LOGO'){
            form.files = this.logo                   // 特殊logo 文件
          }

          const returnData = await interfaceAccountConfigurationSave(form,{
            pagekey: this.pagekey
          });
          if (returnData._result) {
            this.$message({ message: '操作成功', type: 'success' });
            // this.$refs.interfaces.resetFields();
            // this.interfacesSel = {
            //   id: '',
            //   name: '',
            //   dictOperator: '',
            // }
            this.$router.push({ path: '/interface/account-configuration' })
          }
          this.pagekey = await this.$getPageKey();
        }
      })
    }
  }
}
</script>

<style lang="scss">

.el-select-dropdown__item {
  text-align: center;
}
.a {
  margin-bottom: 0 !important;
}
.el-form /deep/ .el-row {
  margin-bottom: 22px;
}
.uploadClass{
  width: 200px;
  height: 80px;
  z-index: 10;
  opacity: 0;
  position: absolute;
  top: 0;
}
.uploadDom{
  width: 200px;
  height: 80px;
  //position: relative;
  //top:0;
  border-radius: 5px;
  border:1px dashed #e6e6e6;
  line-height: 80px;
  text-align: center;
  font-size: 40px;
  color: #888;
}
</style>
